<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>

<!DOCTYPE html>
<html>
	<head>
		<title>评论管理</title>
		<meta name="decorator" content="default"/>
		<script type="text/javascript">     
			$(function(){ 
				var defHeight = 300,wh=$(window).height();
				var lh=$('.location').height(),fh=$('#floatHead').height(),sh=$('.det-list').height(),ph=$('.pagelist').height();
				defHeight = (wh-lh-fh-sh-ph-130);
				$('.flexgrid').flexigrid({striped:true,height:defHeight});
			});
			
			function page(n,s){
				$("#pageNo").val(n);
				$("#pageSize").val(s);
				$("#searchForm").submit();
	        	return false;
	        }
	        
	        function deleteAll(){
				var ids =[];//定义一个数组    
	            $('input[name="checkall"]:checked').each(function(){    
	                ids.push($.trim($(this).val()));
	            });
	            document.location.href='${ctx}/qd/comment/delete?ids='+ids;
			}
	        
	        //显示评论框
			function showReply(article_id,reply_id,nick_name,parent_id){
				if (!$('#coc'+parent_id))alert("该评论已删除");
				$('#coc'+parent_id)[0].article_id=article_id;
				$('#coc'+parent_id)[0].reply_id=reply_id;
				$('#coc'+parent_id)[0].reply_name=nick_name;
				$('#coc'+parent_id)[0].parent_id=parent_id;
				$('#coc'+parent_id).val("");
				$('#coc'+parent_id).attr("placeholder","回复　"+nick_name+"：");
				$('#reply'+parent_id).show();
			}
			
	        //屏蔽评论
	        function auditComment(a, commentId){
	        	var _this = $(a);
	        	$.ajax({
	        		url:'${ctx}/qd/comment/audit',
	        		type:'POST',
	        		data:{ id : commentId },
	        		dataType:'json',
	        		success:function(res){
	        			if(!res){
	        				jsdialog('屏蔽异常：响应为空');
	        				return;
	        			}
	        			
	        			if(res.errCode==='0'){
	        				if(_this.html()=='屏蔽'){
	        					_this.html('已屏蔽');
	        				}else{
	        					_this.html('屏蔽');
	        				}
	        			}
	        			jsdialog('温馨提示',res.errMsg);
	        		},
	        		error:function(res){
	        			jsdialog(res.responseText);
	        		}
	        	})
	        }
	        
		</script>
		<style type="text/css">
			.comment-table { font-size:12px; width:100%;}
			.comment-table td {
			    padding: 10px;
			    vertical-align: top;
			}
			.comment-table .pl-img img {
			    width: 80px;
			    height: 80px;
			    margin: 0 auto;
			}
			.comment-table .comm-time {
			    float: right;
			    font-weight: normal;
			    color: #999;
			}
			.comment-table .comm-time img {
			    width:15px;
			}
			.comment-table div.icons {
			    float: right;
			}
			.comment-table .reply .reply-txt textarea {
			    border: 1px solid #d8d8d8;
			    padding: 5px 1%;
			    width: 97%;
			    height: 80px;
			}
			.comment-table .reply-b {
			    text-align: right;
			    margin-top: 5px;
			}
			.comment-table .reply-b a {
			    display: inline-block;
			    height: 35px;
			    line-height: 35px;
			    border-radius: 2px;
			    background-color: #00a0e9;
			    color: #fff;
			    padding: 0 25px;
			    margin-right: 10px;
			}
		</style>
	</head>
	<body>
		<sys:message content="${message}"/>
		<!--导航栏-->
		<div class="location">
			<a href="javascript:history.back(-1);" class="back"><i></i><span>返回上一页</span></a>
			<a href="${ctx}/center" class="home"><i></i>
			<span>首页</span></a> 
			<i class="arrow"></i> 
			<span>评论管理</span>
		</div>
		<!--/导航栏-->

		<!--工具栏-->
		<div id="floatHead" class="toolbar-wrap">
			<div class="toolbar">
				<div class="box-wrap">
					<a class="menu-btn"></a>
					<div class="l-list">
						<ul class="icon-list">
							<li><a class="all" href="javascript:;" onclick="checkAll(this);"><i></i><span>全选</span></a></li>
							<shiro:hasPermission name="qd:comment:add"><li><a class="add" href="${ctx}/qd/comment/${category == 'activity' ? 'activity/':'' }form"><i></i><span>新增</span></a></li></shiro:hasPermission>
							<shiro:hasPermission name="qd:comment:delete"><li><a id="btnDelete" class="del" href="${ctx}/qd/comment/${category == '0' ? '':'activity/' }delete?id=${comment.id}" onclick="return confirma('确认要删除该评论吗？', deleteAll)"><i></i><span>删除</span></a></li></shiro:hasPermission>
						</ul>
					</div>
					<div class="r-list" style="display:none;">
						<input name="txtKeywords" type="text" id="txtKeywords" class="keyword" /> 
						<a id="lbtnSearch" class="btn-search" href="javascript:void(0)">查询</a>
					</div>
				</div>
			</div>
		</div>
		<!--/工具栏-->
		
		
		<!--搜索栏-->
		<form:form id="searchForm" modelAttribute="comment" action="${ctx}/qd/comment/${category=='activity' ? 'activity' :''}"  method="post">
			<form:hidden path="category"  value="${category}"/>
			<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
			<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
			<div class="det-list clearfix">
			    <div class="group btm">
					<div class="control">
			            <div class="title">评论人昵称</div>
			            <form:input path="replyName" htmlEscape="false" cssClass="input"/>
			        </div>
			        <div class="control">
			            <div class="title">评论内容</div>
			            <form:input path="content" htmlEscape="false" cssClass="input"/>
			        </div>
			        <div class="control">
			            <div class="title">发生日期</div>
			            <div class="date-input">
			            	<i></i>
			            	<fmt:formatDate value="${comment.startOn}" pattern="yyyy-MM-dd" var="startOn" />
			            	<form:input path="startOn"  onclick="WdatePicker({dateFmt:'yyyy-MM-dd'});" htmlEscape="false" cssClass="input" value="${startOn}" />&nbsp;&nbsp;&nbsp;~
			            </div>
			        </div>
			         <div class="date-input">
			            <i></i>
			            <fmt:formatDate value="${comment.endOn}" pattern="yyyy-MM-dd" var="endOn" />
			          	 <form:input path="endOn"  onclick="WdatePicker({dateFmt:'yyyy-MM-dd'});"  htmlEscape="false" cssClass="input" value="${endOn}" />
		          	 </div>
			    </div>   
			    <br>
			    <div class="group btm">
			        <div class="control">
			            <div class="title">总评星</div>
			            <div class="rule-single-select single-select">
										<form:select path="score" >
											<form:option value="" selected="selected" label="评星" />
											<form:option value="1"  label="一星" />
											<form:option value="2"  label="二星" />
											<form:option value="3"   label="三星" />
											<form:option value="4"  label="四星" />
											<form:option value="5"  label="五星" />
										</form:select>
							</div>
			        </div>
			        <div class="control">
			            <div class="title">环境评价</div>
			            <div class="rule-single-select single-select">
										<form:select path="score1" >
											<form:option value="" selected="selected" label="评星" />
											<form:option value="1"  label="一星" />
											<form:option value="2"  label="二星" />
											<form:option value="3"   label="三星" />
											<form:option value="4"  label="四星" />
											<form:option value="5"  label="五星" />
										</form:select>
							</div>
			        </div>
			        <div class="control">
			            <div class="title">老师评价</div>
			            <div class="rule-single-select single-select">
										<form:select path="score2" >
											<form:option value="" selected="selected" label="评星" />
											<form:option value="1"  label="一星" />
											<form:option value="2"  label="二星" />
											<form:option value="3"   label="三星" />
											<form:option value="4"  label="四星" />
											<form:option value="5"  label="五星" />
										</form:select>
							</div>
			        </div>
			        <div class="control" >
			            <div class="title">服务态度</div>
			            <div class="rule-single-select single-select"  >
										<form:select path="score3" >
											<form:option value="" selected="selected" label="评星" />
											<form:option value="1"  label="一星" />
											<form:option value="2"  label="二星" />
											<form:option value="3"   label="三星" />
											<form:option value="4"  label="四星" />
											<form:option value="5"  label="五星" />
										</form:select>
							</div>
			        </div>
			    </div>
			    <div class="group btm">
			    <br>
			    <br>
			    </div>
			    <div class="group searchbtn">
			        <div class="btn-list">
			            <input type="submit" name="btnDetailedSearch" value="查询" id="btnDetailedSearch" class="btn">
			            <input name="btnReturn" type="reset" value="重置" class="btn yellow">
			        </div>
			    </div>
			    <div style="clear:both;"></div>
			</div>
		</form:form>
		<!--/搜索栏-->
		
		<!--列表-->
		<div class="table-container">
			<table class="border-table comment-table">
				<tbody>
					<c:forEach items="${page.list}" var="comment">
					<tr>
						<td style="padding:10px 15px;" width="110px">
							<div class="pl-img">
								<img src="${root}/cdn/image/${comment.member.avatar}_400x400">
							</div>
							<div class="pl-info">
								ID：${comment.replyId}<br>
								昵称：${comment.replyName}<br>				
								中心：${comment.center.name}<br>						
							</div>			
						</td>			
						<td style="padding:10px 15px;">			
							<h3>				
								<span class="comm-time">
									<c:forEach begin="1" end="${comment.score}">
									<img src="${ctxStatic}/images/activity/star.png" alt="点赞"/>
									</c:forEach>
									&nbsp;&nbsp;&nbsp;
									<fmt:formatDate value="${comment.createDate }" pattern="yyyy-MM-dd hh:mm:ss"/> 
								</span>
								<span>${comment.objectName}&nbsp;的评论</span>
							</h3>			
							<div class="comm-desc">			
								<div class="icons">
									<span class="checkall" style="vertical-align: middle;">
										<input type="checkbox" name="checkall" value="${comment.id}" />
									</span> 
									<input type="hidden" name="checkall" value="${comment.id}" />				
									<!-- <a href="#" onclick="gagChange(${comment.id},0);" title="禁言">禁言</a> -->	
									<a href="#" onclick="auditComment(this,${comment.id});" title="屏蔽">${comment.isAudit==0 ? '屏蔽':'已屏蔽' }</a>	
									<%-- <a href="#" onclick="showReply(2499,505,'${comment.replyName}',73979);return false;" title="评论">评论</a> --%>								
								</div>			
								${comment.content}	
								<div class="pl-img">
									<c:forEach items="${comment.albums}" var="album">
									<img src="${root}/cdn/image/${album.orginPath}_400x400">
									</c:forEach>
								</div>
							</div>
							<div	style="padding-top:50px; float: left;font-weight: normal;color: #ccc">
								环境评分:
								<c:forEach begin="1" end="${comment.score1}">
									<img style="width: 15px;height: 12px;" src="${ctxStatic}/images/activity/star.png" alt="点赞"/>
								</c:forEach>
								<br>
								老师评分:
								<c:forEach begin="1" end="${comment.score2}">
									<img style="width: 15px;height: 12px;" src="${ctxStatic}/images/activity/star.png" alt="点赞"/>
								</c:forEach>
								<br>
								服务态度:
								<c:forEach begin="1" end="${comment.score3}">
									<img style="width: 15px;height: 12px;" src="${ctxStatic}/images/activity/star.png" alt="点赞"/>
								</c:forEach>
							</div>
							<ul class="comm-reply">
							</ul> 										
							<div class="reply" style="display:none;" id="reply73979">
								<div class="reply-txt">
									<textarea id="coc73979"></textarea>
									</div><div class="reply-b">
									<a href="javascript:void(0);" onclick="reply(73979);">发布回复</a>						
									<a href="javascript:void(0);" onclick="javascript:$('#pl-btn73979').show();$('#reply73979').hide();" class="pl-reply">取消回复</a>					
								</div>				
							</div>
									
						</td>		
					</tr>
					</c:forEach>
				</tbody>
			</table>
			<%-- <div class="line10"></div>
			<table class="border-table">
				<thead>
					<tr>
						<th width="25">选择</th>
						<th width="100" style="text-align: center;">操作</th>
						<th width="100">分类</th>
						<th width="100">评论关联对象编号</th>
						<th width="100">评分</th>
						<th width="100">内容</th>
						<th width="100">评论人</th>
						<th width="100">评论人名字</th>
						<th width="100">来源IP</th>
						<th width="100">父级评论ID</th>
					</tr>
				</thead>
				<tbody>
					<c:forEach items="${page.list}" var="comment">
					<tr>
						<td style="text-align:center;">
							<span class="checkall" style="vertical-align: middle;">
								<input type="checkbox" name="checkall" value="${comment.id}" />
							</span> 
							<input type="hidden" name="checkall" value="${comment.id}" />
						</td>
						<td align="center" style="text-align: center;">
							<shiro:hasPermission name="qd:comment:edit">
							<a href="${ctx}/qd/comment/${category == '0' ? '':'activity/' }form?id=${comment.id}">修改</a>
							</shiro:hasPermission>
							<shiro:hasPermission name="qd:comment:delete">
							&nbsp;|&nbsp;
							<a href="${ctx}/qd/comment/${category == '0' ? '':'activity/' }delete?id=${comment.id}" onclick="return confirmx('确认要删除该评论吗？', this.href)">删除</a>
							</shiro:hasPermission>
						</td>
						<td>${comment.category}</td>
						<td>${comment.objectId}</td>
						<td>${comment.score}</td>
						<td>${comment.content}</td>
						<td>${comment.replyId}</td>
						<td>${comment.replyName}</td>
						<td>${comment.fromIp}</td>
						<td>${comment.parentId}</td>
					</tr>
					</c:forEach>
				</tbody>
			</table> --%>
		</div>
		<!--/列表-->

		<!--内容底部-->
		<div class="line10"></div>
		<div class="pagelist">
			${page}
		</div>
		<!--/内容底部-->
	</body>
</html>
